<template>
  <div style="height:100%;width:100%;position:relative;">
    <div class="pagetop">
      <template>
        <div style="width:100%">
          <div style="float:left;width:100%">
            <table style="font-size:12px" class="table1style">
              <tr>
                <td align="right">留样条码</td>
                <td colspan="3">
                  <el-input v-model.trim="txtSmp_Barcode" placeholder="" style="width:252px"
                    ref="rSmp_Barcode"></el-input>
                </td>
                <td> 冰箱位置</td>
                <td colspan="3">
                  <el-input v-model.trim="ddlLocation1" placeholder="" style="width:130px"></el-input>
                </td>
                <td colspan="3">
                  <el-input v-model.trim="ddlLocation2" placeholder="" style="width:130px"></el-input>
                </td>
                <td align="right">病人号</td>
                <td>
                  <el-input v-model.trim="txtPatNo" placeholder="" style="width:100px"></el-input>
                </td>
                <td align="right">就诊卡号</td>
                <td>
                  <el-input v-model.trim="txtPatCardNo" placeholder="" style="width:98px"></el-input>
                </td>
                <td align="right">病人姓名</td>
                <td>
                  <el-input v-model.trim="txtPatName" placeholder="" style="width:120px"></el-input>
                </td>
              </tr>
              <tr>
                <td align="right">留样日期</td>
                <td>
                  <el-date-picker v-model="ddltxtSmpDate1" :able="false" type="date" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px;" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="center" style="width:15px;padding:0 0 0 0px">至</td>
                <td>
                  <el-date-picker v-model="ddltxtSmpDate2" type="date" :able="false" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="right"> 样本架号</td>
                <td colspan="3">
                  <el-input v-model.trim="txtShelfType1" placeholder="" style="width:130px"></el-input>
                </td>
                <td colspan="3">
                  <el-input v-model.trim="txtShelfType2" placeholder="" style="width:130px"></el-input>
                </td>
                <td align="right" style="color:red;">送检医院</td>
                <td colspan="3">
                  <el-input v-model.trim="txtSendHospCode" placeholder="" style="width:270px"></el-input>
                </td>
                <td align="right">性别</td>
                <td>
                  <el-input v-model.trim="ddlPatSex" placeholder="" style="width:120px"></el-input>
                </td>
              </tr>
              <tr>
                <td align="right">借出日期</td>
                <td>
                  <el-date-picker v-model="ddlLendDate1" :able="false" type="date" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px;" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="center" style="width:15px;padding:0 0 0 0px">至</td>
                <td>
                  <el-date-picker v-model="ddlLendDate2" type="date" :able="false" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="right"> 借出人</td>
                <td colspan="2">
                  <el-input v-model.trim="txtLendUser" placeholder="" style="width:100px"></el-input>
                </td>
                <td align="right" colspan="2" style="color:blue;"> 借出次数</td>
                <td colspan="2">
                  <el-input v-model.trim="txtLendTime" placeholder="" style="width:100px"></el-input>
                </td>
                <td align="right" style="color:red;">申请科室</td>
                <td colspan="3">
                  <el-input v-model.trim="ddlReqDeptNo" placeholder="" style="width:270px"></el-input>
                </td>
                <td align="right" style="color:blue;">年龄</td>
                <td>
                  <el-input v-model.trim="txtPatAgeStr" placeholder="" style="width:120px"></el-input>
                </td>
              </tr>
              <tr>
                <td align="right">销毁日期</td>
                <td>
                  <el-date-picker v-model="ddltxtOutDate1" :able="false" type="date" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px;" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="center" style="width:15px;padding:0 0 0 0px">至</td>
                <td>
                  <el-date-picker v-model="ddltxtOutDate2" type="date" :able="false" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="right"> 销毁人</td>
                <td colspan="2">
                  <el-input v-model.trim="txtOutUser" placeholder="" style="width:100px"></el-input>
                </td>
                <td align="right" colspan="2"> 在库状态</td>
                <td colspan="2">
                  <el-input v-model.trim="ddlSmpStatus" placeholder="" style="width:100px"></el-input>
                </td>
                <td align="right">临床诊断</td>
                <td colspan="3">
                  <el-input v-model="txtPatDiag" placeholder="" style="width:270px"></el-input>
                </td>
                <td align="right" style="color:red;">病人类型</td>
                <td>
                  <el-input v-model.trim="ddlPatTypeCode" placeholder="" style="width:120px"></el-input>
                </td>
              </tr>
              <tr>
                <td align="right">入库日期</td>
                <td>
                  <el-date-picker v-model="ddltxtInDate1" :able="false" type="date" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px;" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="center" style="width:15px;padding:0 0 0 0px">至</td>
                <td>
                  <el-date-picker v-model="ddltxtInDate2" type="date" :able="false" placeholder="选择日期"
                    value-format="yyyy-MM-dd" style="width:110px" :clearable="false">
                  </el-date-picker>
                </td>
                <td align="right"> 入库人</td>
                <td colspan="2">
                  <el-input v-model.trim="txtInUser" placeholder="" style="width:100px"></el-input>
                </td>
                <td align="right" colspan="4">
                  <el-checkbox v-model="chkIsReserve"></el-checkbox>&nbsp;修改查询条件时不清空列表
                </td>
                <td align="right">标本备注</td>
                <td colspan="3">
                  <el-input v-model="txtSmpComments" placeholder="" style="width:270px"></el-input>
                </td>
                <td align="right" style="color:red;">标本类型</td>
                <td>
                  <el-input v-model.trim="ddlSmpType" placeholder="" style="width:120px"></el-input>
                </td>
              </tr>
            </table>
          </div>
          <div style="float:left;width:100%;">
            <table style="float:right">
              <tr>
                <td>
                  <el-button icon="el-icon-search" type="primary" v-has="'PINQUERY'" @click="BtnQuery()">查询</el-button>
                </td>
                <td style="align:left">
                  <el-button icon="el-icon-delete" v-has="'PDELETE'" @click="BtnDelete()"
                    :disabled="changeflag">删除</el-button>
                </td>
                <td style="align:left">
                  <el-button icon="el-icon-sort" @click.native="BtnSort()">排序</el-button>
                </td>
                <td style="align:left">
                  <el-button icon="el-icon-close" @click.native="BtnClear()">清除</el-button>
                </td>
                <td style="text-align:left">
                  <el-button icon="el-icon-refresh-right" @click="BtnPrint()">打印</el-button>
                </td>
                <td>
                  <el-button icon="el-icon-upload2" v-has="'PEXPORT'" @click="BtnExport()">导出</el-button>
                </td>
                <td>
                  <el-button icon="el-icon-first-aid-kit" @click="BtnBatchLend()">批量借出</el-button>
                </td>
              </tr>
            </table>
          </div>
        </div>
      </template>
    </div>
    <div class="pagecenter">

      <vxe-table :loading="loading" :data.sync="leftTableData" border fit :mouse-config="{ selected: true }" height="auto"
        header-align="center" highlight-current-row highlight-hover-row ref="xTable" resizable
        show-header-overflow="tooltip" show-overflow="tooltip" size="mini" stripe :cell-class-name="CellClassName"
        @current-change="CurrentChangeEvent">
        <vxe-table-column width="50" field="ischk" title="选择" header-align="center" align="center">
          <template v-slot="{ row }">
            <el-checkbox true-label="1" false-label="0" v-model="row.ischk"></el-checkbox>
          </template>
        </vxe-table-column>
        <vxe-table-column field="shelfid" title="留样日期" width="120px"></vxe-table-column>
        <vxe-table-column field="shelftype" title="标本类型" width="100px"></vxe-table-column>
        <vxe-table-column field="shelfno" title="条码号" width="100px"></vxe-table-column>
        <vxe-table-column field="shelfdesc" title="状态" width="80px"></vxe-table-column>
        <vxe-table-column field="rpt_itemname" title="样本位置" width="150px"></vxe-table-column>
        <vxe-table-column field="rownumber" title="行号" width="60px"></vxe-table-column>
        <vxe-table-column field="colnumber" title="列号" width="60px"></vxe-table-column>
        <vxe-table-column field="posnumber" title="位置编码" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="标本备注" width="200px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="预计销毁时间" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="最后入库日期" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="入库人" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="最后借出日期" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="借出人" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="销毁日期" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="销毁人" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="借出次数" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="送检医院" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="申请单ID" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="条码生成时间" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="病人号" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="病人卡号" width="150px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="病人姓名" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="性别" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="病人生日" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="病人年龄" width="80px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="病人类型" width="80px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="申请科室" width="150px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="临床诊断" width="180px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="联系地址" width="250px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="国家/民族" width="120px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="身份证号" width="220px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="联系电话" width="150px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="身高" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="体重" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="ABO血型" width="80px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="RH血型" width="80px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="标本架编号" width="100px"></vxe-table-column>
        <vxe-table-column field="usestatus" title="标本架位置" width="200px"></vxe-table-column>
      </vxe-table>
    </div>
  </div>
</template>

<script type="text/javascript">
import { Promise } from "q"
import { invalid } from "moment"
import XE from "xe-utils" //引入工具类
export default {
  name: "SMP310",
  data() {
    return {
      //top
      txtPatNo: "", //病人号
      txtPatCardNo: "", //就诊卡号
      txtPatName: "", //病人姓名
      txtPatAgeStr: "", //年龄
      txtShelfType1: "", //样本架号1*
      txtShelfType2: "", //样本架号2*
      txtSendHospCode: "", //送检医院*
      txtPatDiag: "", //临床诊断
      txtLendUser: "", //借出人
      txtOutUser: "", //销毁人
      txtInUser: "", //入库人
      txtLendTime: "", //借出次数 默认是0，每次借出后自动加1
      txtSmpComments: "", //标本备注
      txtSmp_Barcode: "", //条码号
      ddlLocation1: "", //冰箱位置1*
      ddlLocation2: "", //冰箱位置2*
      ddlPatSex: "", //性别 1男，2女，3未知
      ddlReqDeptNo: "", //申请科室
      ddlSmpStatus: "", //在库状态 打印/在库/借出/销毁
      ddlPatTypeCode: "", //病人类型
      ddlSmpType: "", //标本类型
      chkIsReserve: false, //修改查询条件时不清空列表
      ddltxtSmpDate1: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //留样日期-起始
      ddltxtSmpDate2: XE.toDateString(new Date(), "yyyy-MM-dd"), //留样日期-结束
      ddlLendDate1: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //借出日期-起始
      ddlLendDate2: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //借出日期-结束
      ddltxtOutDate1: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //销毁日期-起始
      ddltxtOutDate2: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //销毁日期-结束
      ddltxtInDate1: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //入库日期-起始
      ddltxtInDate2: XE.toDateString("0000-00-00", "yyyy-MM-dd"), //入库日期-结束
      loading: false,
      changeflag: false, //Btn是否启用标志
      okFirstLoading: true,
      bbjlx_Data: [],
      tableData: [],
      tempindex: 0,
      leftTableData: [],
      msgList: [],
    }
  },
  created() {
    this.BtnQuery() //初始化主列表
  },
  mounted() {
    this.$refs.rSmp_Barcode.focus()
  },
  updated() {
    // if (this.okFirstLoading) {
    //     let currentrow = this.$refs.xTable.getData(0);
    //     this.$nextTick(() => {
    //         if (currentrow) {
    //             this.okFirstLoading = false;
    //             this.$refs.xTable.setCurrentRow(currentrow);
    //         }
    //     });
    // }
  },
  methods: {
    async BtnQuery() {
      try {
        const res = await this.$tool.request({
          url: "SMP/SMP3/SMP310",
          method: "post",
          data: {
            action: "findData",
          },
        })
        this.leftTableData = res.Data
      } catch (e) {
        this.$message.warning(e)
      }
    },
    BtnDelete() { },
    BtnSort() { },
    BtnClear() {
      this.BtnQuery()
      this.txtPatNo = "" //病人号
      this.txtPatCardNo = "" //就诊卡号
      this.txtPatName = "" //病人姓名
      this.txtPatAgeStr = "" //年龄
      this.txtShelfType1 = "" //样本架号1*
      this.txtShelfType2 = "" //样本架号2*
      this.txtSendHospCode = "" //送检医院*
      this.txtLendUser = "" //借出人
      this.txtOutUser = "" //销毁人
      this.txtInUser = "" //入库人
      this.txtLendTime = "" //借出次数 默认是0，每次借出后自动加1
      this.txtSmpComments = "" //标本备注
      this.txtSmp_Barcode = "" //条码号
      this.txtPatDiag = "" //临床诊断
      this.ddlLocation1 = "" //冰箱位置1*
      this.ddlLocation2 = "" //冰箱位置2*
      this.ddlPatSex = "" //性别 1男，2女，3未知
      this.ddlReqDeptNo = "" //申请科室
      this.ddlSmpStatus = "" //在库状态 打印/在库/借出/销毁
      this.ddlPatTypeCode = "" //病人类型
      this.ddlSmpType = "" //标本类型
      this.ddltxtSmpDate1 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //留样日期-起始
      this.ddltxtSmpDate2 = XE.toDateString(new Date(), "yyyy-MM-dd") //留样日期-结束
      this.ddlLendDate1 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //借出日期-起始
      this.ddlLendDate2 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //借出日期-结束
      this.ddltxtOutDate1 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //销毁日期-起始
      this.ddltxtOutDate2 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //销毁日期-结束
      this.ddltxtInDate1 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //入库日期-起始
      this.ddltxtInDate2 = XE.toDateString("0000-00-00", "yyyy-MM-dd") //入库日期-结束
      this.$nextTick(() => {
        this.$refs.rSmp_Barcode.focus()
      })
    },
    BtnPrint() {
      var sql = ""
      sql = btoa(encodeURIComponent(sql))
      jsObj.PrintCustomReport("5002", sql, "lis", "req_master", "") //*
    },
    BtnExport() {
      let options = {
        filename: "SMP310 标本查询-结果信息.csv",
      }
      this.$refs.xTable.exportCsv(options)
    },
    BtnBatchLend() { },
    CurrentChangeEvent({ row, rowIndex }) {
      this.tempindex = rowIndex
    },
    CellClassName({ columnIndex, row }) {
      if (columnIndex == "0" || columnIndex == "1") {
        if (row.flag == "1") {
          //不能再次选择
          return "col-orange"
        } else {
          //新增的数据
          return ""
        }
      } else {
        return ""
      }
    },
  },
}
</script>

<style scoped>
.pagetop {
  width: 100%;
  height: 210px;
  display: -webkit-box;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  white-space: nowrap;
  border: 1px solid #ccc;
  position: absolute;
  z-index: 99;
  overflow-x: auto;
  white-space: nowrap;
}

.pagecenter {
  position: absolute;
  top: 215px;
  width: 100%;
  left: 0;
  bottom: 0px;
  overflow: auto;
}

.middle-center {
  position: absolute;
  height: 100%;
  left: 0px;
  right: 405px;
  overflow: auto;
}

.middle-right {
  position: absolute;
  height: 100%;
  width: 400px;
  right: 0px;
}

table {
  font-size: 12px;
  border-collapse: separate;
  border-spacing: 5px;
}

.table1style tr td {
  padding: 0px 2px 0px 5px;
}

::v-deep .vxe-table .vxe-body--column.col-orange {
  background-color: #f8f8f8;
}

::v-deep .el-input--suffix .el-input__inner {
  padding-right: 0px;
}</style>